<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <!-- 理想视口 -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1,minimum-scale=1,user-scalable=no" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="shortcut icon" href="../favicon.ico" type="image/x-icon">

    <!-- 基础样式，包含  头部  搜索框  底部 -->
    <link rel="stylesheet" href="../css/base.css">

    <!-- 页面样式 ， 头尾、搜索框样式已包含在base文件中-->
    <!-- <link rel="stylesheet" href="../css/index.css"> -->
    <link rel="stylesheet" href="../css/favourable.css">
    <title>优惠券</title>
</head>

<body>
    <!-- 头部 -->
<header>

    <a href="../index.html">
        <img src="../images/getmoneyctrl_left.png" alt="">
    </a>
    <h2>优惠券</h2>

    <a href="javascript:;">
        <img src="../images/header_app.png" alt="">
    </a>

</header>
    <!-- 导航栏 -->
    <div class="nav">
        <a href="">首页</a>
        <div>></div>
        <a href="">优惠券</a>
    </div>

    <!-- 内容 -->
    <div class="content">
        <ul class="clearfix">
            <!-- 模板内容 -->
        </ul>
    </div>
    <!-- 尾部 -->
<footer>
    <div class="footer_nav">
        <a href="javascript:;">登录</a>
        <a href="javascript:;">注册</a>
        <a href="javascript:;">返回顶部</a>
    </div>
    <div class="footer_app">
        <a href="javascript:;">手机app下载</a>
        <a href="javascript:;">慢慢买手机版</a>
        <span class="tips"> -- 掌上比价平台</span>
    </div>
    <div class="footer_com">m.manmanbuy.com</div>

</footer>

</body>                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                       

</html>
<script src="../lib/zepto/dist/zepto.min.js"></script>
<!-- art-template模板 -->
<script src="../lib/art-template/template-web.js"></script>
<!-- base文件中包含响应式字体设置等方法 -->
<script src="../js/base.js"></script>

<!-- 模板 -->
<script type="text/template" id='favourable'>
    {{ each result value key}}
    <li>
<a href="{{value.couponLink}}?id={{value.couponId}}">
<img src="{{value.couponImg}}" alt="">
<p>{{ value.couponTitle }}</p>
        </a>  
    </li>
    {{ /each }}
</script>
<script>
    $(function () {
        $.ajax({
            url: "http://193.112.55.79:9090/api/getcoupon",
            type: 'get',
            dataType: 'json',
            success: function (res) {
                console.log(res);
                var htmlStr = template('favourable', res)
                $('.content ul').html(htmlStr)
                

            }

        })
    })
</script>